<!-- 全局表默认配置 -->
<template>
  <el-dialog v-if="props.show" :model-value="props.show" title="全局表默认配置" :close-on-click-modal="false" :close-on-press-escape="false"
    top="25vh" width="51%" @close="onHideDetails">
    <div class="padding20" :class="props.showDisable ? 'disableUser' : ''">
      <el-form ref="ruleFormRef" :model="data.formParams" :inline="true" :rules="rules">
        <form-item title="ID" :pass="true" value="id">
          <el-input-number v-model="data.formParams.id" :min="0" :max="99999999999999999999" :precision="0"
            placeholder="请输入ID" clearable controls-position="right" :disabled="props.checkedItem.id?true:false"/>
        </form-item>
        <form-item title="备注" value="remark">
          <el-input class="imWidth80" type="text" v-model="data.formParams.remark" placeholder="请输入备注" clearable />
        </form-item>
        <form-item title="默认配置" :pass="true" value="a_global_parameter">
          <el-input class="imWidth80" type="text" v-model="data.formParams.a_global_parameter" placeholder="请输入默认配置" clearable />
        </form-item>
      </el-form>
    </div>
    <template #footer v-show="!props.showDisable">
      <div class="dialog-footer">
        <el-button type="info" @click="onHideDetails">取 消</el-button>
        <el-button type="primary" @click="gameSet(ruleFormRef)">确 定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script lang="ts" setup>
import { ref, reactive, toRefs, watch, computed, unref } from 'vue'
import { ElMessage } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
import { editGlobal } from '@/api/game'
import { throttle } from '@/utils/index'
import FormItem from '@/components/FormItem/FormItem.vue'
const props = defineProps({
  show: {
    type: Boolean,
    default: () => {
      return false
    }
  },
  showDisable: {
    type: Boolean,
    default: () => {
      return false
    }
  },
  checkedItem: {
    type: Object,
    default: () => {
      return {}
    }
  }
})

watch(
  () => props.checkedItem,
  async (value) => {
    if (value) {
      data.formParams = value as any
    }
  },
)

const data = reactive({
  formParams:{
    id: 0,
    uu_id: 0,
    agent_id: 0,
    remark:'',
    a_global_parameter: '',
  },
})

// 设置
const ruleFormRef = ref<FormInstance>()
const rules = reactive<FormRules<typeof data.formParams>>({
  id: [{ required: true, message: '请输入ID', trigger: 'blur' }],
  a_global_parameter: [{ required: true, message: '请输入默认配置', trigger: 'blur' }],
})
const gameSet = throttle(async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate(async (valid, fields) => {
    if (valid) {
      let res = await editGlobal(data.formParams);
      ElMessage.success('修改成功')
      emit('onHideDetails', true)
    }
  })
}, 3000)

// 重置
const emit = defineEmits(['onHideDetails'])
const onHideDetails = () => {
  emit('onHideDetails', false)
}
</script>

<style scoped lang="scss"></style>
